<link rel="stylesheet" href="/assets/assets(home)/css/poster.css">
<title>推广海报</title>


<!-- <header class="mui-bar mui-bar-nav mui-bar-nav-bg">
    <a id="icon-menu" class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">推广海报</h1>
</header> -->

<div class="content">
    {if condition="$AutoLogin.poster"}
    <div class="poster">
        <img id="poster" src="{$AutoLogin.poster}" alt="点击按钮重新生成海报" />
    </div>
    {/if}

    <div class="link">
        <input type="text" placeholder="普通输入框" readonly id="url" value="{$url}" />
        <button class="mui-btn mui-btn-primary" type="button" id="copy-btn">点我复制</button>
    </div>

    <div class="update">
        <button class="mui-btn mui-btn-success" type="button" id="update-btn">刷新海报</button>
    </div>
</div>
<!-- 
<div class="footer">
    <button class="btn mui-btn-primary">分享</button>
</div> 
-->
<script>
    //修改浏览器自带的后退按钮
    window.history.pushState(null, null, ``);

    window.addEventListener('popstate', function (e) {
        e.preventDefault()
        location.href = `{:url('/home/business/center')}`
    }, false)

    var copyBtn = document.getElementById('copy-btn')
    var updateBtn = document.getElementById('update-btn')

    // 点我复制功能
    copyBtn.onclick = async function () {
        /* 获取文本内容 */
        let url = document.getElementById('url')
        /* 选择复制内容 */
        url.select()
        /* 复制内容到文本域 */
        document.execCommand("copy", false)
    }

    // 刷新海报
    updateBtn.onclick = function () {
        $.ajax({
            type: 'POST',
            dataType: 'json',
            success: (success) => {
                mui.toast(success.msg)

                if (success.code) {
                    $("#poster").prop('src', success.data.poster)
                }
            }
        })
    }

    let poster = document.getElementById('poster')

    //如果没有海报地址，就默认触发点击事件
    if (!poster) {
        updateBtn.click()
        location = location
    }
</script>